<template>
	<view style="width: 100%;background-color: #f3f3f3;display: flex;flex-direction: column;font-size:14px;color: #333333;position: relative;" >
		
		<view class="order" v-if="id > 0">
			
				<block v-if="item">
					<view class="order-item">
					<view class="order-top">
						<view class="num">订单单号：{{ item.order_no }}</view>

						<view class="state" v-if="item.status == 3">待核销</view>
						<view class="state" v-if="item.status != 3">已完成</view>
					</view>
				<view class="order-center"  v-for="(it, idx) in item.allGoods" :key="idx">
					<view class="img"><image class="order-img" :src="it.goods_logo" mode=""></image></view>
					<view class="center-right">
						<view class="title">{{ it.goods_title }}</view>
						<view class="detail">
							<view class="detail-price">￥{{ it.price_selling / it.number_goods }}</view>
							<view class="detail-num">x{{ it.number_goods }}</view>
						</view>
					</view>
				</view>
				<view class="total">
					共{{ item.goods_count }}件，合计：
					<view class="money">￥{{ item.pay_price }}</view>
				</view>
				</view>
			</block>
		</view>
		<block v-if="item.status == 3">
		<div  style="position: fixed;bottom: 20upx;width: 100%;z-index: 10000;margin-bottom: 50upx;">
			<div class="submit" v-on:click="submit">确认核销</div>
		</div>
		</block>
	</view>


	

</template>

<script>
	import service from '@/store/service.js';

	export default {
		data() {
			return {
				item:{},
				userid:'',
				id:''
			};
		},
		onLoad:function(e){
	
		
			
			if(e.orderid == undefined || e.orderid == '')
			{
				uni.showModal({
					title: '錯誤',
					content: '未找到订单',
					showCancel: false,
					success: function(res) {
						uni.navigateTo({
							url: '/pages/main/index'
						});
					}
				});
				return;
			}else{

				var self = this
				self.id = e.orderid
				self.$http.get('sms_store/order/verification',{orderid:e.orderid}).then(function(res) {
					console.log(res)
					if(res.code == 1)
					{
						self.item = res.data
					}else{
						uni.showModal({
							title: '錯誤',
							content: res.info,
							showCancel: false,
							success: function(res) {
								uni.navigateTo({
									url: '/pages/main/index'
								});
							}
						});
						return;
					}
				});
				return;

			}
			
		},
		onShow: function() {

		
		},
		methods: {
			submit:function()
			{
				var self = this
						
				self.$http.get('sms_store/order/verification',{orderid:self.id}).then(function(res) {
					if(res.code == 1)
					{
						self.item.status =5
						uni.showModal({
							title: '成功',
							content: '核销成功',
							showCancel: false,
							success: function(res) {
								uni.navigateTo({
									url: '/pages/main/index'
								});
							}
						});
				
						return;
					}else{
						setTimeout(function() {
						
							uni.showToast({
								title: res.info,
								icon: 'none'
							});
						}, 500);
						return;
					}
				});
			},
			loading: function() {

			
			}
		
		}
	}
</script>

<style>
	 .coupon-title{
	    font-size: 15px;
	    font-weight: bold;
	}
.submit{
	display: flex;
	justify-content: center;
	align-items: center;
	background: #ff5555;
	border-radius: 20upx;
	height: 2.4rem;
	color: white;
	margin: 0 10upx;
}
.c-title{
	min-width:200px;
}
.title{
  width: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  color: #ffffff;
  font-size: 32upx;
}
.list{
  display: flex;
  justify-content:  space-around;
  align-items: center;
  width: 100%;
}
.fl-ct{
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-items: center;
	font-size: 24upx;
	width: 33.3333%;
}
.list-num{
  width: 100upx;
  height: 100upx;
  border-radius: 50%;
  background-color: #059bfe;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 28upx;
  color: #ffffff;
}
    .coupon-title{
        font-size: 15px;
        font-weight: bold;
    }
    .coupon-flex{
        display: flex;
        align-items: center;
        margin-bottom: 5px;
    }
    .coupon-column{
        display: flex;
        flex-direction: column;
        margin-top: 5px;
    }
    .coupon-between{
        display: flex;
        justify-content: space-between;
    }
.coupon-content{
	display: flex;
	width: 100%;
	flex-direction: column;
}
.content{
  background-color: #ffffff;
  display: flex;
  flex-direction: column;
  width: 100%;
  justify-content: center;
  align-items: center;
  margin-top:20px; 
  min-height: 70px;
}
.content-c{
  display: flex;
  justify-content: flex-start;
  width: 90%;
  font-size: 14px;
  margin-top:10px; 
}
.button{
		font-size: 24upx;
		float: right;
		height: 48upx;
		line-height: 48upx;
		background-color: rgb(5, 155, 254);
		padding:0upx 20upx;
		color: #FFFFFF;
	}
	
	
	.order-list {
		margin-top: 110upx;
	}
	
	.order-item {
		margin-bottom: 20upx;
		margin: 20upx;
		background-color: #fff;
		padding: 30upx 22upx 24upx 22upx;
		border-radius: 20upx;
	}
	
	.order-top {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	
	.num {
		font-size: 26upx;
		color: #666666;
	}
	
	.state {
		color: #f81149;
		font-weight: bold;
	}
	
	.order-center {
		border-bottom: 1px solid rgba(237, 237, 237, 1);
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	
	.img {
		width: 190upx;
		margin-top: 30upx;
		margin-bottom: 24upx;
	}
	
	.order-img {
		width: 190upx;
		height: 187upx;
	}
	
	.center-right {
		flex: 1;
		margin-left: 25upx;
	}
	
	.title {
		color: #333;
		font-size: 26upx;
		font-weight: bold;
		margin-bottom: 20upx;
	}
	
	.detail {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	
	.detail-price {
		color: #333;
		font-size: 32upx;
		font-weight: bold;
	}
	
	.detail-num {
		color: #333;
		font-size: 24upx;
		font-weight: bold;
	}
	
	.total {
		display: flex;
		justify-content: flex-end;
		color: #333;
		font-weight: bold;
		padding: 20upx 0;
	}
	
	.bottom {
		display: flex;
		justify-content: flex-end;
	}
	
	.money {
		color: #f81149;
		font-weight: bold;
	}
	
	.back {
		border: 1px solid #999;
		border-radius: 33upx;
		width: 186upx;
		height: 65upx;
		line-height: 65upx;
		text-align: center;
		box-sizing: border-box;
		color: #666;
		margin-right: 24upx;
	}
	
	.warn {
		border: 1px solid #f81149;
		border-radius: 33upx;
		width: 186upx;
		height: 65upx;
		line-height: 65upx;
		text-align: center;
		box-sizing: border-box;
		height: 65upx;
		color: #f81149;
	}
</style>
